{extend name="common/head"/}
	<link rel="stylesheet" href="{__ADMIN__}/js/fontIconPicker/themes/bootstrap-theme/jquery.fonticonpicker.bootstrap.min.css">
	<link href="{__ADMIN__}/js/fontIconPicker/css/jquery.fonticonpicker.min.css" rel="stylesheet">
	<!--标签插件-->
	<link rel="stylesheet" href="{__ADMIN__}/js/jquery-tagsinput/jquery.tagsinput.min.css">
	<link href="{__ADMIN__}/css/style.min.css" rel="stylesheet">
{block name="body"}
<div class="container-fluid p-t-15">

	<div class="row">
		<div class="col-lg-12">
			<div class="card">
				<div class="card-body">

					<form onsubmit="return false" action="#!" method="post" class="row" id="form1">
						<input type="hidden" name="id" value="0">
						<div class="form-group col-md-12">
							<label for="pid">父级菜单</label>
							<div class="form-controls">
								<select name="pid" class="form-control" id="pid">
									<option value="0">作为顶级菜单</option>
									{volist name=":set_recursion(get_admin_menu())" id="v"}
									<option value="{$v.id}" {eq name="pid" value="$v.id" }selected="" {/eq}>{$v.title} </option>
									{/volist}
								</select>
							</div>
						</div>
						<div class="form-group col-md-12">
							<label for="title">菜单名称</label>
							<input type="text" class="form-control" id="title" name="title" value="" placeholder="请输入菜单名称" />
						</div>
						<div class="form-group col-md-12">
							<label for="title">菜单路径</label>
							<input type="text" class="form-control" id="src" name="src" value="" placeholder="请输入菜单路径，可空" />
						</div>
						<div class="form-group col-md-12">
							<label for="title">菜单参数</label>
							<input type="text" class="form-control" id="param" name="param" value="" placeholder="请输入菜单参数，可空" />
						</div>
						<div class="form-group col-md-12">
							<label for="title">菜单图标</label>
							<input type="text" id="icon-example" name="icon" />
							<span id="show-mdi"></span>
						</div>
						<div class="form-group col-md-12">
							<button type="submit" class="btn btn-primary ajax-post" target-form="add-form" onclick="add()">确 定</button>
							<button type="button" class="btn btn-default" onclick="javascript:history.back(-1);return false;">返 回</button>
						</div>
					</form>

				</div>
			</div>
		</div>

	</div>

</div>
{/block}
{block name="script"}
{include file="common/footer" base="base" /}

<script type="text/javascript" src="{__ADMIN__}/js/fontIconPicker/jquery.fonticonpicker.min.js"></script>
<!--标签插件-->
<script src="{__ADMIN__}/js/jquery-tagsinput/jquery.tagsinput.min.js"></script>
<script type="text/javascript" src="{__ADMIN__}/js/main.min.js"></script>
<script type="text/javascript">
	jQuery(document).ready(function($) {
		var font_element = $('#icon-example').fontIconPicker({
			theme: 'fip-bootstrap'
		});
		$.ajax({
			url: '{__ADMIN__}/js/fontIconPicker/fontjson/materialdesignicons_v4.json',
			type: 'GET',
			dataType: 'json'
		}).done(function(response) {
			var fontello_json_icons = [];
			$.each(response.glyphs, function(i, v) {
				fontello_json_icons.push( v.css );
			});
			font_element.setIcons(fontello_json_icons);
		}).fail(function() {
			console.error('字体图标配置加载失败');
		});
	});
	$(document).on('change', '#icon-example', function(){
		$('#icon').val($(this).val());
	});
	function add() {
		$.ajax({
			//几个参数需要注意一下
			type: "POST",//方法类型
			dataType: "json",//预期服务器返回的数据类型
			url: "/admin/menu/post_submit" ,//url
			data: $('#form1').serialize(),
			success: function (res) {
				console.log(res);//打印服务端返回的数据(调试用)
				if (res.code === 0) {
					$.alert({
						title: '成功',
						icon: 'mdi mdi-alert',
						type: 'blue',
						content: res.msg,
						buttons: {
							okay: {
								text: '确认',
								btnClass: 'btn-blue',
								action: function() {
									location.reload();
								}
							}
						}
					});
					// setTimeout(function() {
					//     //	parent.document.location.reload();
					//     parent.document.location.href="{:url('/admin/index')}";
					// }, 1500);
				}else {
					$.alert({
						title: '错误',
						icon: 'mdi mdi-alert',
						type: 'red',
						content: res.msg,
						buttons: {
							okay: {
								text: '确认',
								btnClass: 'btn-blue',
								action: function() {
									//$('[alt="captcha"]').click();
								}
							}
						}
					});
				};
			},
			error : function() {
				$.alert({
					title: '警告',
					content: '请检查返回是否正常！',
					icon: 'mdi mdi-access-point-network-off',
					animation: 'scale',
					closeAnimation: 'scale',
					buttons: {
						okay: {
							text: '确认',
							btnClass: 'btn-blue'
						}
					}
				});
			}
		});
	}
</script>
{/block}
</body>
</html>